<template>
  <div class="item">
    <label for :style="'width: ' + labelWidth + ';'">
      <span v-if="isNeed == 'true'" class="tips">* </span>
      {{ labelName }}
    </label>
    <div class="inline-block">

      <div 
        class="radio-box"
        :style="'width:' + radioItemWidth + ';' " 
        v-for="(item, index) in radioOpts" 
        :key="index"
        @change="handleChange">
        <el-radio 
          v-model="tThis.formData[radioName]" 
          :label="item.labelVal + '' "
          >
          {{item.labelText}}
          </el-radio
        >
      </div>

    </div>
  </div>
</template>

// <radio-edit
//   labelName="标签名字"
//   radioName="state"
//   :radioOpts="tempOpts"
//   :tThis="this"
//   isSingle="true"
//   radioItemWidth="80px"
//   labelWidth="100px"
//   isNeed="true"
//   default="1"
// />
// <!-- @valueChange="handleChange" -->

<script>
export default {
  components: {},
  props: {
    labelName: {
      type: String,
    },
    radioName: {
      type: String,
    },
    isSingle: {
      type: String,
    },
    radioOpts: {
      type: Array,
    },
    tThis: {
      type: Object,
    }, 
    radioItemWidth: {
      type: String,
    },
    labelWidth: {
      type: String,
    },
    isNeed: {
      type: String,
    },
    default: {
      type: String
    }
    //默认值功能未实现
  },
  data() {
    return {
      // radioOpts: [
      //   { labelVal: 1, labelText: '上架' },
      //   { labelVal: 2, labelText: '下架' },
      // ]
    };
  },
  mounted() {
    // console.log(77666, this.default)
    // if(this.default) {
    //   this.tThis.formData[this.radioName] = this.default + '';
    // }
    
  },
  methods: {
    //改变
    handleChange(){
      this.$emit('valueChange');
    }
  },
};
</script>

<style lang="scss" scoped>
// @import '~styles/mixins.scss';
// @import '~styles/variables.scss';
</style>